<template>
  <a-modal 
    :visible="visible"
    okText="提交" 
    :footer="false"
    cancelText="关闭"
    :title="title"
    :maskClosable="false"
    :destroyOnClose="true"
    :keyboard="false"
    width="800px"
    @cancel="closeModal()">
    <a-form :form="form"  :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
      
      <a-form-item label="评价商品">
        <a-input
          readOnly
          v-decorator="['productName']"
        />
      </a-form-item>
      <a-form-item label="商品规格">
        <a-input
          readOnly
          v-decorator="['skuName']"
        />
      </a-form-item>
      <a-form-item label="用户昵称">
        <a-input
          readOnly
          v-decorator="['nickName']"
        />
      </a-form-item>
      <a-form-item label="评价来源">
        <a-input
          readOnly
          v-decorator="['source']"
        />
      </a-form-item>
      <a-form-item label="评价星级">
        <a-rate
          disabled=""
          v-decorator="['stars']"
        />
      </a-form-item>
      <a-form-item label="是否置顶">
       {{isTop}}
      </a-form-item>
      <a-form-item label="评价图片">
        <upload-image 
          :disabled="true"
          :limit="10"
          v-decorator="['picUrl']"
        />
      </a-form-item>
      <a-form-item label="评价内容">
        <a-textarea
          readOnly
          v-decorator="['evaluation']"
        />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
export default {
  name: 'appraise-info',
  props: {
    record: {
      type: Object,
      default() {
        return {}
      }
    },
    visible: {
      type: Boolean,
      default: false
    },
  },
  computed: {
    title () {
      return '查看评价'
    },
    
  },
  data () {
    return {
      form: this.$form.createForm(this, { name: 'coordinated' }),
      isTop: ''
    }
  },
  watch: {
    visible (value) {
      if (value && this.record.id) {
        this.getInfo()
      }
    }
  },
  mounted () {
  },
  methods: {
    getInfo () {
      this.$get('/product/reviews/id', {id: this.record.id}).then(res => {
        if (res && res.returnCode === 1000) {
          const record = res.dataInfo || {}
          console.log(record)
          this.isTop =  record.isTop === 1? '是':'否'
          record.source = ['', '小程序', '虚拟评价'][record.source]
          this.$nextTick(()=> {
            const formItems = this.form.getFieldsValue();
            Object.keys(formItems).forEach(key => {
              formItems[key] = record[key]
            })
            this.form.setFieldsValue(formItems);
          })
        }
      })
    },
    closeModal (freshTable) {
      this.form.resetFields()
      this.$emit('cancel', freshTable)
    }
  }
}
</script>